<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <base href="/">
    <link rel="stylesheet" href="../static/layui/css/layui.css">
    <script src="../static/js/jquery-3.2.1.min.js"></script>
    <script src="../static/layui/layui.js"></script>
    <script>
        $(function () {
            $("#btnClose").on("click", function () {
                var index = parent.layer.getFrameIndex(window.name); //先得到当前iframe层的索引
                parent.layer.close(index); //再执行关闭
            });

            var roleId = window.location.href.split("=")[1];
            $("input[name='roleId']").val(roleId);
            // 获取所有权限
            $.get({
                url: "admin/permission/getAll"
                ,async: false
                ,success: function (result) {
                    if (result.success) {
                        var permissionDiv = '';
                        var permissions = result.data.list;
                        for (var i = 0;i < permissions.length;i++){
                            var item = permissions[i];
                            permissionDiv += '<input type="checkbox" name="permissionId" value="'+ item.id +'" title="'+ item.name +'"><br>';
                        }
                        $("#permissionDiv").html(permissionDiv);
                        layui.form.render();
                    }else {
                        layer.msg(result.message + "无法获取权限");
                    }
                }
            });
            // 渲染该管理员已经有的权限
            $.get({
                url: "admin/role/permission"
                ,data: {
                    roleId: roleId
                }
                ,success: function (result) {
                    if (result.success){
                        var permissionIds = result.data.list;
                        for(var i = 0;i<permissionIds.length;i++){
                            var permissionId = permissionIds[i].permissionId;
                            $("input[value='"+ permissionId +"'][name='permissionId']").prop("checked",true);
                        }
                        layui.form.render();
                    }else {
                        layer.msg(result.message);
                    }
                }
            });

            $("#save").on("click",function () {
                $.get({
                    url: "admin/role/authorize"
                    ,async: false
                    ,data: $("form").serialize()
                    ,success: function (result) {
                        if (result.success){
                            var index = parent.layer.getFrameIndex(window.name); //先得到当前iframe层的索引
                            parent.layer.close(index); //再执行关闭
                        }else {
                            layer.msg(result.message);
                        }
                    }
                })
            })
        })
    </script>
</head>
<body>
    <div>
        <form class="layui-form">
            <input type="hidden" name="roleId" value="">
            <div class="layui-form-item">
                <label class="layui-form-label">角色权限：</label>
                <div class="layui-input-block">
                    <div id="permissionDiv">
                    <!--<option value=""></option>-->
                    </div>
                </div>
            </div>
            <div class="layui-form-item model-form-footer" align="center">
                <!--<label class="layui-form-label"/></label>-->
                <button id="btnClose" class="layui-btn layui-btn-primary close" type="button">取消</button>
                <button class="layui-btn" lay-filter="userinfo-submit" lay-submit type="button" id="save">保存</button>
            </div>

        </form>
    </div>
</body>
</html>